<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    // JavaScript中, 对象类型是由键值对形式组成 (键名是字符串类型,健值可以是任意类型)

    // var obj = {
    //     num:1,
    //     str:"hello",
    //     bool:true,
    //     a:null,
    //     b:undefined,
    //     grade:[55,66,77],
    //     info:{height:177,weight:"60kg"},
    // }

    // 上述对象中, 键名均是字符串类型, 能不能以其他类型(非字符串类型)作为键名?
    // 解答:如果以其他类型作为键名, 会先隐式转化为字符串类型,在作为键名!!!!

   /*  var o = {}

    // 字符串类型作为键名
    // o.a = 100;
    // o["b"] = 200;

    var num = 100;
    var str ="hello";
    var bool = true;
    var a = null;
    var arr= [1,2,3];
    var oKey = {a:1,b:2};

    // 将上述变量作为对象的键名(非字符串类型)
    o[num] = 200;
    o[str] = "world";
    o[bool] = false;
    o[a] = undefined;
    o[arr] = arr;
    o[oKey] = oKey;
    console.log(o);

    for(var key in o){
        console.log(key,typeof key);
    }


    // 数组和对象转字符串

    // 数组转字符串 => 等价于 数组.join(",")
    console.log(arr.toString());
    console.log(String(arr));

    // 对象转字符串 => "[object Object]"
    console.log(oKey.toString());
    console.log(String(oKey)); */



</script>
<script>
    // Map => ES6新增数据结构(类对象结构)

    // JavaScript 的对象（Object），本质上是键值对的集合（Hash 结构），但是传统上只能用字符串当作键。这给它的使用带来了很大的限制。

    // 为了解决这个问题，ES6 提供了 Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。也就是说，Object 结构提供了“字符串—值”的对应，Map 结构提供了“值—值”的对应，是一种更完善的 Hash 结构实现。如果你需要“键值对”的数据结构，Map 比 Object 更合适。

    // 如何创建Map结构  => 构造函数创建
    var m = new Map();
    console.log(m);
    
    
    // Map数据结构的属性和方法
    // 属性:
    // size  返回Map数据结构成员的个数 => 数据的条数 (成员=>组成Map结构的每项数据)


    // 方法:  数据的增删改查
    // set(key,value)  对应键名赋值 (没有就新增,有就修改)  => 返回值:新增数据后,Map数据结构本身(可以使用链式操作)
    // get(key)        对应键名取值  返回值: 如果存在就返回健值,不存在就返回undefined
    // delete(key)     对应键名删除数据(单删)   返回值: 删除成功返回true,删除失败返回false
    // clear()         清除Map数据结构所有数据  返回值: undefined
    // has(key)        判断Map数据结构是否存在某个键名(属性名)
    // forEach()       遍历方法(用法同forEach)
    
    // console.log(m.size);

    var arr= [1,2,3];
    var oKey = {a:1,b:2};

    // 一个一个存储
    m.set(100,200);
    m.set("hello","world");
    m.set(true,false);
    m.set(null,undefined);
    m.set(arr,arr);
    m.set(oKey,oKey);
    console.log(m); // [{key:100,value:200},{key:"hello",value:"world"}]


    // var result = m.set(100,200);  // 返回值是map数据结构本身
    // console.log(result); // m

    // Map数据的链式操作
    // var result = m.set(100,200).set("hello","world").set(true,false).set(null,undefined).set(arr,arr).set(oKey,oKey);
    // console.log(result); // m
    // console.log(m); // [{key:100,value:200},{key:"hello",value:"world"}]


    // console.log(m.get(100));
    // console.log(m.get("hello"));
    // console.log(m.get(true));
    // console.log(m.get(null));
    // console.log(m.get(arr));
    // console.log(m.get(oKey));

    // console.log(m.get("test"));


    // console.log(m.has(100));
    // console.log(m.has("hello"));
    // console.log(m.has(true));
    // console.log(m.has(null));
    // console.log(m.has(arr));
    // console.log(m.has(oKey));

    // console.log(m.has("test"));

    // delete(key)     对应键名删除数据(单删) 
    // console.log(m.delete(100));
    // console.log(m.delete("hello"));
    // console.log(m.delete(true));
    // console.log(m.delete(null));
    // console.log(m.delete(arr));
    // console.log(m.delete(oKey));
    // console.log(m.delete("test"));

    // m.clear();

    console.log(m);



    // m.forEach(function(val,key,map){
    //     // console.log(val,key,map);
    //     console.log(key,val,map);
    // })



    

</script>
</html>